<template>
  <div>
    <ul> 
      <router-link tag="li" :to="item.linkurl" v-for="(item,index) in items"  :key="index">{{item.text}}</router-link>
    </ul>
  </div>
</template>

<script>
export default {
  data () {
    return {
      items:[
        {text:'自动扣分',linkurl:'/'},
        {text:'手动扣分',linkurl:'/sdkf'},
        {text:'积分管理',linkurl:'/jfgl'}
      ]
    }
  }
}
</script>


<style scoped>
  ul{width: 100%;overflow: hidden;padding: 0 20px;margin-bottom:10px;border-bottom: 1px solid #DEDEDE;background:white;box-sizing: border-box;height: 60px;}
  li{padding:0px 20px;margin-right: 20px;float: left;cursor: pointer;color:#495060;border-radius: 5px;height: 40px;line-height: 40px;margin-top:10px;}
  li:hover{background: #495060;transition: all 0.3s;color:white}
  .router-link-exact-active{background:#495060;transition: all 0.3s;color:white}
</style>
